import { createApp } from "vue";
import App from "./App.vue";
const app = createApp(App)

import router from "./router";
import store from "./store";
import mitt from "mitt" //事件总线
import { ElButton, ElSelect, ElInput, ElIcon, ElAvatar, ElTable, ElTableColumn, ElTree, ElPopover, ElForm, ElFormItem, ElCheckbox, ElPagination,ElOption,ElDatePicker,ElCol,ElImage,ElDrawer,ElDialog,ElTag,ElCascader } from 'element-plus';
app.config.globalProperties.$ELEMENT = { size: 'small' }

// axios
import Request from '@/server/http'
import Api from '@/server/api'
app.provide('$Request', Request)
app.provide('$Api', Api)

// utils
import Utils from '@/utils/base'
app.provide('$Utils',Utils)

// global scss
import "@/styles/index.scss"

// global component
const requireComponent = require.context('@/components/',true,/\.vue$/)
requireComponent.keys().forEach(filename => {
  //获取组件配置
  const componentConfig = requireComponent(filename);
  const componentSet = componentConfig.default || componentConfig
  const componentName = componentSet.name
  //自动化注册组件
  app.component(componentName,componentSet)
});

// store
app.use(store)

// router
app.use(router)
//路由钩子
router.beforeEach((to:any, from, next) => {
  // 切换路由页面返回顶部
  window.scrollTo(0,0);

  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  /* 匹配路由权限 */
  const userInfo = sessionStorage.getItem("token") || null; //获取登录信息
  if (!userInfo && to.meta.auth) {
    next("/login");
  } else {
    next();
  }
});

// element plus
app.component(ElButton.name, ElButton);
app.component(ElSelect.name, ElSelect);
app.component(ElInput.name, ElInput);
app.component(ElIcon.name,ElIcon);
app.component(ElAvatar.name,ElAvatar);
app.component(ElTable.name,ElTable);
app.component(ElTableColumn.name,ElTableColumn);
app.component(ElTree.name,ElTree);
app.component(ElPopover.name,ElPopover);
app.component(ElForm.name,ElForm);
app.component(ElFormItem.name,ElFormItem);
app.component(ElCheckbox.name,ElCheckbox);
app.component(ElPagination.name,ElPagination);
app.component(ElOption.name,ElOption);
app.component(ElDatePicker.name,ElDatePicker);
app.component(ElCol.name,ElCol);
app.component(ElImage.name,ElImage);
app.component(ElDrawer.name,ElDrawer);
app.component(ElDialog.name,ElDialog);
app.component(ElTag.name,ElTag);
app.component(ElCascader.name,ElCascader);
// load app
app.mount("#app");